<script setup>
import keepAliveExclude from '@/reactive/index.js';
import { useRouter } from 'vue-router';

const router = useRouter();

defineOptions({
  name: 'Tab1',
});

console.log('tab1-init');

const back = () => {
  router.back();
};
</script>

<template>
  <div class="header">
    <button @click="back">返回上一页</button>
    <h3>tab1</h3>
  </div>

  <RouterView v-slot="{ Component }">
    <KeepAlive :exclude="keepAliveExclude">
      <component :is="Component" />
    </KeepAlive>
  </RouterView>
</template>

<style scoped>
.header {
  display: flex;
  align-items: center;

  h3 {
    margin-left: 100px;
  }
}
</style>
